<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
	<link rel="shortcut icon" href="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/img/logo.png"/>
	<title>订单</title>
	<script src="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/frame/mui/js/mui.min.js"></script>
	<link href="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/frame/mui/css/mui.min.css" rel="stylesheet" />
	<link href="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/css/other/all.css" rel="stylesheet" />
	<link rel="stylesheet" href="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/font/iconfont.css">
	<link href="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/css/other/app.css?v=1" rel="stylesheet" />
	<link href="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/css/dropload.css" rel="stylesheet" />
</head>
<style>
	.mui-content{
		padding-bottom: 0;overflow: hidden;padding-top: 40px;
	}
	.all_list{overflow: hidden;}
	.all_list .close .fl{display: block;}
	.all_list .close{overflow: hidden;}
	.orders_all ul li{width: auto !important;padding: 0 10px;min-width: calc(100% / 6);}
	.noorder{height: 100vh;background: url('/static/wechat/img/noorder.png') no-repeat;background-size: 35%;background-position: center;}
	.all_list .close .fl{float: right !important;margin-right: 15px;}
	.mui-table-view-cell a{height: 43px;line-height: 21px;font-size: 16px;}
	.all_list .commodity_details:nth-of-type(1){margin-top: 5px;}
	.all_list .commodity_details:nth-last-of-type(2){margin-bottom: 5px}
	#mask{position: fixed;left: 0;bottom: 0;background: rgba(0,0,0,0.3);z-index: 99;height: 100vh;width: 100vw;overflow: hidden;display: 
		none}
	#sheet{width: 100%;/*height: 0%*/position: absolute;bottom: 0;z-index: 100;left: 0;padding: auto;}
	#sheet .mui-table-view{margin: 8px;border-radius: 4px}
	#sheet .mui-table-view-cell{text-align: center;color:#007aff;}
	.mui-table-view-cell:after{left: 0}
	.sheet{bottom: 0;animation: sheet 0.2s linear}
	@keyframes sheet
	{
	from {bottom: -200px}
	to {bottom:0;}
	}
</style>
<body>
	<div id="mask">
	<div id="sheet">
		<ul class="mui-table-view">
			<li class="mui-table-view-cell">
				<a class="gopay" data-type="1">余额</a>
			</li>
			<li class="mui-table-view-cell">
				<a class="gopay" data-type="2">微信</a>
			</li>
			<li class="mui-table-view-cell">
				<a class="gopay" data-type="3">支付宝</a>
			</li>
		</ul>
		<ul class="mui-table-view">
			<li class="mui-table-view-cell">
				<a id="cancle"><b>取消</b></a>
			</li>
		</ul>
	</div>
	</div>
	<div class="orders_all">
		<ul>
			<li><a class="qh {{if eq .status ""}}on{{end}}" data-status="">全部订单</a></li>
			<li><a class="qh {{if eq .status "1"}}on{{end}}" data-status="1">待付款</a></li>
			<li><a class="qh {{if eq .status "2"}}on{{end}}" data-status="2">待发货</a></li>
			<li><a class="qh {{if eq .status "3"}}on{{end}}" data-status="3">待收货</a></li>
			<li><a class="qh {{if eq .status "4"}}on{{end}}" data-status="4">待评价</a></li>
			<li><a class="qh {{if eq .status "5"}}on{{end}}" data-status="5">已完成</a></li>
		</ul>
	</div>
	<div class="all mui-content">
			<div class="noorder" style="display: none;">
			</div>
			{{range .info}}
			<div class="all_list clear" data-type="{{.status}}">
				<a href="/mobile/index/shop?id={{.gid}}">
				<h1>
					<span class="mui-icon iconfont fs-16">&#xe75f;</span> 
					{{if .gname}}
					{{.gname}}
					{{else}}
					{{$.system.name}}
					{{end}}
					<span class="fr">
							{{if eq .status "1"}}
							待付款
							{{else if eq .status "2"}}
							待发货
							{{else if eq .status "3"}}
							待收货
							{{else if eq .status "4"}}
							待评价
							{{else if eq .status "5"}}
							已完成
							{{end}}
					</span>
				</h1>
				</a>
				{{range .shopcar}}
				<div class="commodity_details">
					<div class="commodity">
						<a class="one" href="/mobile/column/product_content?id={{.pid}}">
							<div>
								<img src="{{.pathname}}">
								<div>
									<p>{{.title}}</p>
									<p>
										规格 : {{.number}}{{.spec}}/箱<br>
										型号 : {{.model}}<br>
									</p>
									<p class="bfd">￥ {{.price}}<span class="fr">x{{.num}}</span></p>
								</div>
							</div>
						</a>
					</div>
				</div>
				{{end}}
				<div class="close tx-r">
					<span class="fl"> 合计:￥ <b>{{.money}}</b> {{if ne .count "0.00"}}( 优惠 ￥{{.count}} ){{end}}</span>
						{{if eq .status "1"}}
						<p class="clear">
						<span data-id="{{.id}}" class="pay">立即付款</span>
						<span class="cancel" data-id="{{.id}}">取消订单</span>
						</p>
						{{else if eq .status "2"}}
						<p class="clear">
						<!-- <span>等待发货</span> -->
						<a style="color: #1f1f1f" href="/mobile/my/order_return_apply?id={{.id}}"><span>申请退款</span></a>
						</p>
						{{else if eq .status "3"}}
						<p class="clear">
						<a style="color: #1f1f1f" href="/mobile/my/order_return_apply?id={{.id}}"><span>申请退款</span></a>
						<span data-id="{{.id}}" class="received">确认收货</span>
						</p>
						{{else if eq .status "4"}}
						<p class="clear">
						<a style="color: #1f1f1f" href="/mobile/my/order_evaluation_add?id={{.id}}"><span>立即评价</span></a>
						</p>
						{{end}}
					
				</div>
			</div>
			{{end}}
			
		<!-- <div class="no">
			<img src="">
			<h1>您还没有相关的订单</h1>
		</div> -->
	</div>

</body>
</html>
<script src="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/js/zepto.min.js"></script>
{{template "wechat/public/share.html" .}}
<script>
	var end=0
	var status={{.status}},systemName={{.system.name}};
	var list=document.getElementsByClassName('all_list')
	var noorder=document.getElementsByClassName('noorder')[0]
	function qh(){
		noorder.style.display='none'
		var num=0
		if(status==""){
			for(var i=0;i<list.length;i++){
				num+=1
				list[i].style.display='block'
			}
		}else{
			for(var i=0;i<list.length;i++){
				var type=list[i].getAttribute("data-type")
				if(status==type){
					num+=1
					list[i].style.display='block'
				}else{
					list[i].style.display='none'
				}
			}
		}
		if(num==0&&end==1){
			noorder.style.display='block'
		}else{
			$('body').scrollTop(1)
		}
	}
	qh()
	mui('body').on('tap','a',function(){
		var h=this.getAttribute('href');
		if(h){window.location.href=h};
	});
	var mask=document.getElementById('mask')
	var sheet=document.getElementById('sheet')
	var oid
	document.getElementById('cancle').addEventListener('tap',function(){
		mask.style.display='none'
		sheet.className=''
	})
	mask.addEventListener('tap',function(){
		mask.style.display='none'
		sheet.className=''
	})
	mui('body').on('tap','.pay', function(){
		mask.style.display='block'
		sheet.className='sheet'
		oid=this.getAttribute("data-id")
		mask.addEventListener('touchmove',function(e){
			e.preventDefault()
		})
	});
	mui('body').on('tap', '.gopay', function() {
		mask.style.display='none'
		sheet.className=''
		var paytype=this.getAttribute("data-type")
		mui.ajax(window.location.href,{
			data:{oid:oid,paytype:paytype},
			type:"post",
			success:function(res){
				if(res.status==0){
					mui.alert("网络繁忙,请重试","提示")
				}else if(res.status==1){
					if(res.type==1){
						mui.alert('支付成功',function(){
						var html=`<a style="color: #1f1f1f" href="/mobile/my/order_return_apply?id=`+oid+`"><span>申请退款</span></a>`
							mui('.pay').each(function(){
								if(this.getAttribute("data-id")==oid){
									this.parentNode.innerHTML=html	
								}
							})
						});
					}else if(res.type==2){
						var payparms=res.res
						wx.chooseWXPay({
							timestamp: payparms.timeStamp, // 支付签名时间戳，注意微信jssdk中的所有使用timestamp字段均为小写。但最新版的支付后台生成签名使用的timeStamp字段名需大写其中的S字符
							nonceStr: payparms.nonceStr, // 支付签名随机串，不长于 32 位
							package: payparms.package, // 统一支付接口返回的prepay_id参数值，提交格式如：prepay_id=\*\*\*）
							signType: 'MD5', // 签名方式，默认为'SHA1'，使用新版支付需传入'MD5'
							paySign: payparms.paySign, // 支付签名
							success: function (res) {
								mui.toast('支付成功')
								var html=`<a style="color: #1f1f1f" href="/mobile/my/order_return_apply?id=`+oid+`"><span>申请退款</span></a>`
								mui('.pay').each(function(){
									if(this.getAttribute("data-id")==oid){
										this.parentNode.innerHTML=html	
									}
								})
							}
						});
					}
				}else if(res.status==2){
					mui.confirm("余额不足,是否前往充值?","提示",function(data){
						if(data.index){
							window.location.href="/mobile/my/money/recharge"
						}
					})
				}
			}
		})
	});
	var qhbutton=document.getElementsByClassName('qh')
	mui('body').on('tap','.qh',function(){
		mui(".qh").each(function(){
			this.className = "qh"
		});
		this.className = "qh on"
		status=this.getAttribute('data-status')
		qh()
	})
    mui('.cancel').each(function () {
     	var that = this
    	var code = this.getAttribute('data-id');
	    this.addEventListener('tap', function() {
    		this.disabled=true
    		var that=this
			mui.confirm('确定取消订单吗?', '提示', function(e) {
				if (e.index) {
					mui.ajax('/mobile/del',{
						data:{id:code,table:'mt_order'},
						timeout:10000,
						success:function(res){
							if (res==1) {
								var pdom=that.parentNode.parentNode.parentNode
								pdom.parentNode.removeChild(pdom)
	    						mui.toast("取消订单成功~")
	    						return;
		    				}else{
	    						mui.toast("网络繁忙,请重试!")
	    						return;
		    				}
		    				that.disabled=false
						},error:function(){
							mui.toast("网络繁忙,请重试!")
							that.disabled=false
						}
					})
				}else{
					that.disabled=false
				}
			})
		});
    });
    mui('.received').each(function () {
    	this.addEventListener('tap',function () {
    		this.disabled=true
    		var id=this.getAttribute('data-id');
    		var that=this
    		mui.confirm('您确定要确认收货吗?', '提示', function(e) {
    			if(e.index){		
		    		mui.ajax('/mobile/my/order_confirm',{
						type:'get',
						data:{id:id},
						dataType:'json',
						timeout:10000,
						success: function(data){
							if (data) {
								mui.alert('确认收货成功',function(){
								var html=`<a style="color: #1f1f1f" href="/mobile/my/order_return_apply?id=`+id+`"><span>申请退款</span></a>
										<a style="color: #1f1f1f" href="/mobile/my/order_evaluation_add?id=`+id+`"><span>立即评价</span></a>`
									that.parentNode.innerHTML=html
								});
							}else{	
								mui.toast("网络慢，请重试");
							}
							that.disabled=false
						},
						error: function(xhr, type){
							mui.toast("网络慢，请重试");
							that.disabled=false
						// 即使加载出错，也得重置
						}
					});
    			}else{
    				that.disabled=false
    			}
			});
    	})
    });
</script>
<script src="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/js/dropload.min.js"></script>
<script type="text/javascript">
	var page=2
	$('elements').dropload({
	    scrollArea : window,
	    loadDownFn : function(me){
	        $.ajax({
	            type: 'GET',
	            url: window.location.href,
	            dataType: 'json',
	            data:{page:page},
	            success: function(res){
	              page+=1
	              if(res){
	                 for (var i=0;i<res.length;i++){
	                    var div = document.createElement('div');
	                    div.className="all_list clear"
	                    div.setAttribute("data-type", res[i].status)
	 					var	html=`<a href="/mobile/index/shop?id=`+res[i].gid+`"><h1><span class="mui-icon iconfont fs-16">&#xe75f;</span>`
	 					if(res[i].gname){
	 						html+=res[i].gname
	 					}else{
	 						html+=systemName
	 					}
	 					html+=`<span class="fr">`
	 					switch (res[i].status){
	 						case "1":
	 						html+=`待付款`
	 						break
	 						case "2":
	 						html+=`待发货`
	 						break
	 						case "3":
	 						html+=`待收货`
	 						break
	 						case "4":
	 						html+=`待评价`
	 						break
	 						case "5":
	 						html+=`已完成`
	 						break
	 					}
						html+=`</span></h1></a>`
						if(res[i].shopcar){
							for(var j=0;j<res[i].shopcar.length;j++){
								html+=`<div class="commodity_details"><div class="commodity"><a class="one" href="/mobile/column/product_content?id=`+res[i].shopcar[j].pid+`">
								<div><img src="`+res[i].shopcar[j].pathname+`"><div><p>`+res[i].shopcar[j].title+`</p><p>
								规格 : `+res[i].shopcar[j].number+res[i].shopcar[j].spec+`/箱<br> 型号 : `+res[i].shopcar[j].model+`<br></p>
								<p class="bfd">￥ `+res[i].shopcar[j].price+`<span class="fr">x`+res[i].shopcar[j].num+`</span></p></div></div></a></div></div>`
							}
						}
						html+=`<div class="close tx-r"><span class="fl"> 合计:￥ <b>`+res[i].money+`</b>`
						if(res[i].count!="0.00"){
						 html+=`( 优惠 ￥`+res[i].count+` )`
						}
						html+=`</span>`
						switch (res[i].status){
	 						case "1":
	 						html+=`<p class="clear"> <span data-id="`+res[i].id+`" class="pay">立即付款</span> <span class="cancel" data-id="`+res[i].id+`">取消订单</span></p>`
	 						break
	 						case "2":
	 						html+=`<p class="clear"><a style="color: #1f1f1f" href="/mobile/my/order_return_apply?id=`+res[i].id+`"><span>申请退款</span></a></p>`
	 						break
	 						case "3":
	 						html+=`<p class="clear"> <a style="color: #1f1f1f" href="/mobile/my/order_return_apply?id=`+res[i].id+`"><span>申请退款</span></a> <span data-id="`+res[i].id+`" class="received">确认收货</span> </p>`
	 						break
	 						case "4":
	 						html+=`<p class="clear"> <a style="color: #1f1f1f" href="/mobile/my/order_evaluation_add?id=`+res[i].id+`"><span>立即评价</span></a> </p>`
	 						break
	 					}
						html+=`</div>`
	                    div.innerHTML=html
	                    document.getElementsByClassName('all')[0].appendChild(div)
	                }
	                qh()
	                me.resetload();
	                }else{
	                	end=1
	                    mui.toast("没有更多了！");
	                    $(".dropload-down").remove();
	                }
	            },
	            error: function(xhr, type){
	                mui.toast("网络慢，请重新刷新!");
	                me.resetload();
	            }
	        });
	    }
	});
</script>